<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="../layui/css/layui.css" media="all">
    <link rel="stylesheet" href="../layui/css/eleTree.css" media="all">
    <style>

</style>
</head>
<body>
    <button id="parentIframe" class="layui-btn">dsadasdasdas</button>
    
    <button class="layui-btn">获取选中数据</button>
    <!-- 选择菜单 -->
    <div id="menuLayer" style="display: none;padding:10px;">
        <div class="eleTree ele1" lay-filter="data1"></div>
    </div>
    <script src="../layui/layui.js"></script>
   <script type="text/javascript">
    layui.config({
    base: '../layui/lay/mymodules/' //假设这是test.js所在的目录   可以把你需要扩展的js插件都放在一个文件夹内
    }).extend({ //设定组件别名
        eleTree: 'eleTree'
    });

    layui.use(['jquery','eleTree'], function(){
        var eleTree = layui.eleTree;
          var  $ = layui.jquery;
           var data=[
           {
            "label": "上级菜单",
            "spread": true,
            id:123,
            "children": [
            {
                "label": "管理员",
                "spread": true,
                id:12
            },
            {
                "label": "普通用户",
                "spread": true,
                id:13
            },
            {
                "label": "高级管理员",
                "spread": true,
                id:14
            }
            ]
        }];
         eleTree.render({
            elem: '.ele1',
            // url: "/tree",
            // type: "post",
            data: data,
            showCheckbox: true,
            contextmenuList: ["copy","add","edit","remove"],
            accordion: true
        });
        

         $('#parentIframe').on('click', function(){

              layer.open({
                type: 1,
                offset: '50px',
                skin: 'layui-layer-molv',
                title: "选择菜单",
                area: ['300px', '450px'],
                shade: 0,
                shadeClose: false,
                content: $("#menuLayer"),
                btn: ['确定', '取消'],
                btn1: function (index) {
                    var node = ztree.getSelectedNodes();
                    //选择上级菜单
                    vm.menu.parentId = node[0].menuId;
                    vm.menu.parentName = node[0].name;

                    layer.close(index);
                }
            });
          });


    });
   </script>

</body>
</html>